{extend name="common@admin_base" /}

{block name="head_extends"}
<script>
    layui.use('table', function(){
        var table = layui.table;

        var useridDOM = $('#userid');
        var usernameDOM = $('#username');
        var emailDOM = $('#email');
        //监听单元格编辑
        table.on('edit(users)', function(obj){
            var value = obj.value //得到修改后的值
                ,data = obj.data //得到所在行所有键值
                ,field = obj.field; //得到字段
            $.ajax({
                data:data,
                url:"{$_form.admin_user_update}",
                method:"post",
                success:function (data) {
                    var d = JSON.parse(data);
                    if (d.msg == 1){
                        layer.msg(d.info);
                    }else{
                        layer.msg(d.info);
                    }
                },
                error:function (err) {
                    console.info(err);
                }
            });
        });


        //刷新按钮点击事件
        $("#search").on('click',function () {
            table.reload('users', {
                where: { //设定异步数据接口的额外参数，任意设
                    userId: useridDOM.val()
                    ,username: usernameDOM.val()
                    ,email:emailDOM.val()
                    //…
                }
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });

        $('reflash').on('click',function () {
            table.reload('users', {
                where: { //设定异步数据接口的额外参数，任意设
                    userId: useridDOM.val()
                    ,username: usernameDOM.val()
                    ,email:emailDOM.val()
                    //…
                }
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });

        //工具栏监听
        table.on('tool(users)', function(obj){
            var data = obj.data;
            console.info(data);
            if(obj.event === 'detail'){
                layer.open({
                    id:'id'+data.userId,
                    title:'用户详情',
                    area: ['1000px', '500px'],
                    offset: 't',
                    type: 2,
                    content: ['{$_form.admin_user_detail}'+data.userId] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
                });
            } else if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    obj.del();
                    layer.close(index);
                });
            } else if(obj.event === 'edit'){
                layer.alert('编辑行：<br>'+ JSON.stringify(data))
            }
        });

        $('#add').on('click',function () {
            layer.open({
                title:'新增用户',
                area: ['1000px', '500px'],
                offset: 't',
                type: 2,
                content: ['{$_form.admin_user_add}'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
            });
        })
    });
</script>
{/block}
{block name="body"}
<div class="demoTable">
    搜索ID：
    <div class="layui-inline">
        <input class="layui-input" name="userid" id="userid" autocomplete="off">
    </div>
    用户名：
    <div class="layui-inline">
        <input class="layui-input" name="username" id="username" autocomplete="off">
    </div>
    邮箱：
    <div class="layui-inline">
        <input class="layui-input" name="email" id="email" autocomplete="off">
    </div>
    <button class="layui-btn" data-type="reload" id="search"><span class="layui-icon layui-icon-search"></span>搜索</button>
    <a id="add" class="layui-btn layui-bg-blue"><span class="layui-icon layui-icon-add-circle"></span>新增</a>
    <a id="reflash" class="layui-btn layui-btn-primary"><span class="layui-icon layui-icon-refresh"></span>刷新</a>
</div>
<table class="layui-table" lay-data="{ url:'{$_form.admin_user_list}', id:'users', page: {layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'], groups: 1 }}" lay-filter="users">
    <thead>
    <tr>
        <!--<th lay-data="{type:'checkbox'}">ID</th>-->
        <th lay-data="{field:'userId', minWidth:50, sort: true,width:50}">ID</th>
        <th lay-data="{field:'username', minWidth:80, sort: true, edit: 'text',width:120}">用户账户（手机号）</th>
        <th lay-data="{field:'email', minWidth:50, sort: true, edit: 'text',width:90}">电子邮箱</th>
        <th lay-data="{field:'nickname', minWidth:50, sort: true, edit: 'text',width:76}">用户昵称</th>
        <th lay-data="{field:'personalitySignature', minWidth:60, sort: true, edit: 'text',width:90}">个性签名</th>
        <th lay-data="{field:'createTime', minWidth:170, sort: true,width:170}">创建时间</th>
        <th lay-data="{field:'updateTime', minWidth:170, sort: true,width:170}">更新时间</th>
        <th lay-data="{field:'trueName', minWidth:75, sort: true, edit: 'text',width:75}">真实姓名</th>
        <th lay-data="{field:'idCardNo', edit: 'text', minWidth: 175,width:175}">身份证号码</th>
        <th lay-data="{fixed: 'right', align:'center', toolbar: '#tool'}">操作</th>
    </tr>
    </thead>
</table>

<script type="text/html" id="tool">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
{/block}